//js/index.js
$(function(){
	var $ul=$("ul.banner-img");
	var $ulIds=$("ul.indicators");
  var LIWIDTH=1000,interval=500,wait=3000,moved=0,timer=null;
  
	$.ajax({
		type:"get",
		url:"php/index/getCarousel.php",
		dataType:"json",
		success:function(data){
			var html="";
			for(var c of data){
				var {img_pmy, aid}=c;
				html+=`<li>
					<a href="article.html?aid=${aid}" >
						<img src="${img_pmy}">
					</a>
				</li>`;
			}
			var {img_pmy, aid}=data[0];
			html+=`<li>
				<a href="article.html?aid=${aid}">
					<img src="${img_pmy}">
				</a>
			</li>`;
			$ul.html(html).css("width",LIWIDTH*(data.length+1));
			$ulIds.html("<li></li>".repeat(data.length))
				.children(":first").addClass("active");
			autoMove();
		}
  });
  
	function autoMove(){
		timer=setInterval(function(){
			move();
		},wait);
  }
  
	function move(){
		moved++;
		$ul.animate({
			left:-moved*LIWIDTH
		},interval,function(){
			if(moved==$ul.children().length-1){
				$ul.css("left",0);
				moved=0;
			}
			$ulIds.children(":eq("+moved+")").addClass("active")
				.siblings().removeClass("active");
		})
  }
  
	$("ul.banner-img").mouseenter(function(){
		clearInterval(timer);
		timer=null;
	}).mouseleave(function(){
		autoMove();
  });
  
	$ulIds.on("click","li",function(){
		var $li=$(this);
		var i=$li.index();
		moved=i;
		$ul.stop(true).animate({
			left:-moved*LIWIDTH
		},interval,function(){
			$ulIds.children(":eq("+moved+")").addClass("active")
				.siblings().removeClass("active");
		})
  });
  
  var $aLeft=$(".arr-left"),$aRight=$(".arr-right");
  
	$aRight.click(function(){
		if(!$ul.is(":animated")){
			move();
		}
  });
  
	$aLeft.click(function(){
		if(!$ul.is(":animated")){
			if(moved==0){
				moved=$ul.children().length-1;
				$ul.css("left",-moved*LIWIDTH);
			}
			moved--; 
			$ul.animate({
				left:-moved*LIWIDTH
			},interval,function(){
				$ulIds.children(":eq("+moved+")").addClass("active")
					.siblings().removeClass("active");
			})
		}
  })
  // 轮播结束
});

$(function(){
    $.ajax({
      type:"get",
      url:"php/index/getIndexArticle.php",
      dataType:"json",
    }).then(function({data1,data2}){
      var html="";
      html+=`<div class="artic-big"><a href="article.html?aid=${data1.aid}"><img src="${data1.img_pmy}" alt=""></a></div>`;
			for(var a of data2){
				var {img_pmy, aid}=a;
				html+=`<div><a href="article.html?aid=${aid}"><img src="${img_pmy}" alt=""></a></div>`;
      }
      $('section.article5').html(html);
    })
});
